<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<title>我们科技-经典案例</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<link rel="icon" type="image/x-icon" th:href="@{~/images/favicon_zn.ico}">
<link href="../static/css/bootstrap.css" th:href="@{~/css/bootstrap.css}" rel='stylesheet' type='text/css' />
<link href="../static/css/font-awesome.css" th:href="@{~/css/font-awesome.css}" rel="stylesheet"> 
<link rel="stylesheet" href="../static/css/slider.css" th:href="@{~/css/slider.css}">
<link href="../static/css/style.css" th:href="@{~/css/style.css}" rel='stylesheet' type='text/css' />	
<link rel="stylesheet" type="text/css" href="../static/css/mislider.css" th:href="@{~/css/mislider.css}"/>
<link rel="stylesheet" type="text/css" href="../static/css/mislider-skin-cameo.css" th:href="@{~/css/mislider-skin-cameo.css}"/>
<link rel="stylesheet" type="text/css" href="../static/css/login.css" th:href="@{~/css/login.css}"/>
<link th:href="@{/css/nav.css}" rel='stylesheet' type='text/css' />
<style type="text/css">
	 body{background: #f0f0f0;}
	.top_header_agile_info_w3ls{background: #fff;}
	 #m_nav_list li a{color: #666;}
</style>
</head>
	<body>
	<div id="" style="position: relative;">


	<div class="top_banner" id="topl">
		<!-- SVG Arrows -->
	
		<div class="top_header_agile_info_w3ls">
		  <nav class="navbar navbar-default">
				<div class="navbar-header navbar-left">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
						<span class="sr-only">版权</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
					<h1>
						<a class="navbar-brand" href="index.html" th:href="@{~/}">
							<img src="../static/images/logoll.png" th:src="@{~/images/logoll_zn.png}"/>
						</a>
					</h1>
				</div>
				<!-- Collect the nav links, forms, and other content for toggling -->
					<div class="collapse navbar-collapse navbar-right" id="bs-example-navbar-collapse-1">

					<div id="m_nav_container" class="m_nav wthree_bg">
						<nav class="menu menu--sebastian">
							<ul id="m_nav_list" class="m_nav menu__list">
								<li class="m_nav_item" id="m_nav_item_1"> <a href="index.html" th:href="@{~/home}" class="link link--kumya"><span >首页</span></a></li>
								<li class="m_nav_item" id="moble_nav_item_3"> <a href="right_affirm.html" th:href="@{~/affirm.html}" class="link link--kumya"><span >版权确权</span></a></li>
								<li class="m_nav_item" id="moble_nav_item_4"> <a href="copyright_show.html" th:href="@{~/copyright.html}" class="link link--kumya"><span >版权展示</span></a></li>
							    <li class="m_nav_item" id="moble_nav_item_5"> <a href="consulting.html" th:href="@{~/consulting.html}" class="link link--kumya"><span >资讯阅读</span></a></li>
								<li class="m_nav_item active" id="moble_nav_item_6"> <a href="case.html" th:href="@{~/case.html}" class="link link--kumya"><span>经典案例</span></a></li>
								 <li class="m_nav_item " id="moble_nav_item_7" th:if="${session.user} != null"> <a href="#" th:href="@{~/chain/statistics.html}" class="link link--kumya"><span>区块展示</span></a></li>
							    <li class="m_nav_item" id="m_nav_item_1"> <a th:href="@{~/}" class="link link--kumya"><span >公司简介</span></a></li>
								<li th:if="${session.user} != null" class="m_nav_item dropdown-back-white" id="moble_nav_item_6"> 
									<span class="link link--kumya"><span class="dropbtn-back-white" th:text="${session.user.userName}==null?${#strings.length(session.user.userNickname)>5?#strings.substring(session.user.userNickname,0,5)+'...':session.user.userNickname}:${#strings.length(session.user.userName)>5?#strings.substring(session.user.userName,0,5)+'...':session.user.userName}">登录/注册</span><i class="menu-ico-back-white"></i></span>
									<div class="dropdown-content-back-white">
									    <a th:href="@{~/user/userInfo.html}">用户中心</a>
									    <a th:href="@{~/auth/longOut}">退出</a>
								  </div>
								</li>
								<li th:unless="${session.user} != null" class="m_nav_item" id="moble_nav_item_6"> 
									<a  href="login.html" class="link link--kumya" th:href="@{/auth/loginPage.html}">
										<span>登录/注册</span>
									</a> 
								</li>
								<!--<li class="m_nav_item "  style="float: right;">
									<select  name="selectDropDown" style="border:1px solid transparent;appearance:none;-moz-appearance:none;-webkit-appearance:none; padding:0px 20px;background:transparent;font-size: 14px;line-height: 34px; ">
										<option  value="0">中文 (简体)</option>
										<option  value="1">English</option>
									</select>
								</li>-->
							</ul>
						</nav>
					</div>

					</nav>
				</div>
		</div>
      <!--welcome-->
 </div>
	</div>

<style type="text/css">
	 .formd{padding-top: 120px; min-height: 892px;}
     .formd ul li{border: 4px solid #f0f0f0; background: #fff;min-height:400px;position: relative; }
     .formd ul{clear: both;}
     .obgs{background: rgba(187,137,17,0.6);}
     .obgl{background: rgba(17,137,187,0.6);}
     .formdodiv{width: 100%; height: 100%; position: absolute;left: 0; text-align: center;}
     .formdodiv h1{ font-weight:600;font-size: 30px; line-height: 300px; text-align: center; color: #fff;}
     .formdodiv a{ font-size: 14px;border: 2px solid #fff; border-radius: 5px; padding:8px 15px;line-height: 30px; font-weight:600;text-align: center; color: #fff;}
     #formdodivo{background:url(images/g1.jpg) no-repeat; position: relative;}
     #formdodivo2{background:url(images/g5.jpg) no-repeat; position: relative;}
     .obgposit{position: relative;}
     .col-lg-2{padding: 0;}
     .obgimg img{width: 100%; height: 100%; max-height:250px; height: 200px;}
     .obgtxt{margin: 20px 0;}
     .obgtxt h5{font-size: 16px; clear: both;}
     .obgtxt p{font-size: 14px;}
     .obgopp{margin-top: 20px;clear: both;}
     .obgbutton{width: 100%; text-align: center;line-height: 30px; background: #ccc; position: absolute;bottom: 0; padding: 10px 0; color: #fff;}
</style>
<div class="formd" id="list-content" style="margin-bottom: 60px;">

		<!-- <ul>
			<li class="col-lg-2 " id="formdodivo">
				<div class="formdodiv obgl">
					<h1>艺术</h1>
					<a href="">查看更多</a>
				</div>		
			</li>
			<li class="col-lg-2 obgposit">
				<div class="obgimg">
					<img th:src="@{~/images/ab.jpg}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
						<p class="description">
							金色财经-区块链8月16日讯  记者：邸卉 2017第四届区块链国际峰会于8月15日在上海盛大召开，超过1000名全球金融科技行业决策者参与了活动。
						</p>
					</div>
					<div style="clear: both;">
						<div class="obgbutton">
						   点击查看详情
						</div>
					</div>
			</li>
			<li class="col-lg-2">
				<div class="obgimg">
					<img th:src="@{~/images/g6.jpg}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
					</div>
						<div style="clear: both;">
					<div class="obgbutton">
					   点击查看详情
					</div>
				</div>
			</li>
			<li class="col-lg-2">
				<div class="obgimg">
					<img th:src="@{~/images/g3.jpg}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
					</div>
						<div style="clear: both;">
					<div class="obgbutton">
					   点击查看详情
					</div>
				</div>
			</li>
			<li class="col-lg-2">
				<div class="obgimg">
					<img th:src="@{~/images/g4.jpg}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
					</div>
						<div style="clear: both;">
					<div class="obgbutton">
					   点击查看详情
					</div>
				</div>
			</li>
			<li class="col-lg-2">
				<div class="obgimg">
					<img th:src="@{~/images/p1.png}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
					</div>
						<div style="clear: both;">
					<div class="obgbutton">
					   点击查看详情
					</div>
				</div>
			</li>
		</ul>
		<ul>
			<li class="col-lg-2" id="formdodivo2">

				<div class="formdodiv obgs">
					<h1>漫画</h1>
					<a href="">查看更多</a>
				</div>		
	
			</li>
			<li class="col-lg-2">
				<div class="obgimg">
					<img th:src="@{~/images/p3.png}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
					</div>
						<div style="clear: both;">
					<div class="obgbutton">
					   点击查看详情
					</div>
				</div>
			</li>
			<li class="col-lg-2">
				<div class="obgimg">
					<img th:src="@{~/images/p4.jpg}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
					</div>
						<div style="clear: both;">
					<div class="obgbutton">
					   点击查看详情
					</div>
				</div>
			</li>
			<li class="col-lg-2">
				<div class="obgimg">
					<img th:src="@{~/images/ab.jpg}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
					</div>
						<div style="clear: both;">
					<div class="obgbutton">
					   点击查看详情
					</div>
				</div>
			</li>
			<li class="col-lg-2">
				<div class="obgimg">
					<img th:src="@{~/images/g2.jpg}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
					</div>
						<div style="clear: both;">
					<div class="obgbutton">
					   点击查看详情
					</div>
				</div>
			</li>
			<li class="col-lg-2">
				<div class="obgimg">
					<img th:src="@{~/images/p2.png}"/>
				</div>
				<div class="obgtxt">
					<h5 class="col-lg-12">初音未来（初音ミク/Hatsune Miku）</h5>
					<div style="clear: both;">
						
					</div>
					<div class="obgopp">
						<p class="col-lg-6">时间：</p><p class="col-lg-6">2007/8/31</p>
					</div>
						<div style="clear: both;">
					<div class="obgbutton">
					   点击查看详情
					</div>
				</div>
			</li>
		</ul> -->
<div style="height: 30px; clear: both;">
		
	</div>
</div>

	<div class="footer" >

    <div class="agileinfo_footer_bottom1">
			<div class="container">
				    <p class="col-lg-2" style="padding-right: 0;"><a th:href="@{~/}">关于我们</a>&nbsp; &nbsp;<a href="javascript:;">法律协议</a></p>
				
					<p class="col-lg-10 text-right"> &copy;2017 wevolution Allg Rights Reserved. powered by 上海我们信息科技有限公司 <img th:src="@{~/images/pic1.gif}"  style="margin-top:5px;"/> 沪ICP备17045920号</p>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
		


<script type="text/javascript" src="../static/js/jquery-2.1.4.min.js" th:src="@{~/js/jquery-2.1.4.min.js}"></script>
<script type="text/javascript" src="../static/js/sleekslider.js" th:src="@{~/js/sleekslider.js}"></script>
<script type="text/javascript" src="../static/js/app.js" th:src="@{~/js/app.js}"></script>
<script src="../static/js/bootstrap.js" th:src="@{~/js/bootstrap.js}"></script>
<script src="../static/js/layer/layer.js"th:src="@{/js/layer/layer.js}"></script>
<!-- //for bootstrap working -->
<script type="text/javascript">
$(function(){
	$.ajax({
		url : "/indexInfo/caseList",
		type : "GET",
		data : {},
		cache : false,
		success : function(data) {
			var jsondata = JSON.parse(data); 
			var _data = jsondata.data;
			var _list = JSON.parse(_data.list);//后台数据
			console.log(_list);
			var _datalist = _list.data;
		 	 $("#list-content").empty();
			var cells = '';
			if(_list.succeed=="0"){
				for(var j=0;j<_datalist.length;j++){
					var o_list = _datalist[j].list;
					cells += '<ul>';
					if(_datalist[j].caserType=="0"){
						if(o_list.length>0){
							cells += '<li class="col-lg-2" id="formdodivo2">';
							cells += '<div class="formdodiv obgs">';
							cells += '<h1>漫画</h1>';
							cells += '</div></li>';
						}
					}else{
						if(o_list.length>0){
							cells += '<li class="col-lg-2 " id="formdodivo">';
							cells += '<div class="formdodiv obgl">';
							cells += '<h1>艺术</h1>';
							cells += '</div></li>';
						}
					}
					for(var i=0;i<o_list.length;i++){
						cells += '<li class="col-lg-2 obgposit">';
						cells += '<div class="obgimg">';
						cells += '<a target="_blank" href="/case/info.html?id='+o_list[i].id+' "class="a-img">'
						if(o_list[i].coverImageUrl.indexOf("http")==-1){
							cells += '<img src="'+_data.domain+o_list[i].coverImageUrl+'" ></a>';
						}else{
							cells += '<img src="'+o_list[i].coverImageUrl+'" ></a>';
						}
						cells += '</div>';
						cells += '<div class="obgtxt">';
						cells += '<a target="_blank" href="/case/info.html?id='+o_list[i].id+' "class="a-img">';
						if(o_list[i].title==null||o_list[i].title=="null"||o_list[i].title==undefined||o_list[i].title=="undefined"||o_list[i].title==""){
							cells += '<h5 class="col-lg-12" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" title="'+o_list[i].workName+'">'+o_list[i].workName+'</h5>';
						}else{
							cells += '<h5 class="col-lg-12" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" title="'+o_list[i].title+'">'+o_list[i].title+'</h5>';
						}
						cells += '</a>';
						cells += '<div style="clear: both;"></div>';
						cells += '<div class="obgopp">';
						cells += '<p class="col-lg-12">时间:'+o_list[i].publishDate+'</p>';/*  class="col-lg-4"  class="col-lg-8"*/
						cells += '<div class="obgopp">';
						if(o_list[i].caserDesc.length>52){
							cells += '<p class="description" style="height: 81px;overflow: hidden;padding: 15px;">'+o_list[i].caserDesc.substring(0,52)+'...</p>';
						}else{
							cells += '<p class="description" style="height: 81px;overflow: hidden;padding: 15px;">'+o_list[i].caserDesc+'</p>';
						}
						cells += '</div>';
						cells += '<div style="clear: both;">';
						//cells += '<div class="obgbutton"> 点击查看详情</div>';
						cells += '</div></li>';
					}
					cells += '</ul>';
				}
				$("#list-content").append(cells); 
			}else{
				layer.msg(_data.errorMsg);
			}
		},
		error : function() {
			layer.msg("服务器错误");
		}
	});
})
window.onload = function ()
{
    var sel = document.getElementsByName('selectDropDown')[0];
    sel.onchange = function ()
    {
        // var options=$("#test option:selected");
        var val = this.value;
        switch (val)
        {
            case "0":
                break;
            case "1":
                window.location.href='/case_en.html';
                break;
            default:
                break;
        }
    }
}
</script>
</body>
</html>